import {
  addEhsInfo,
  delEhsInfo,
  exportEhsInfo,
  getEhsInfoByPage,
  updateEhsInfo,
  getEhsCommissioners,
  getEhsHandlers,
  addEhsItem,
  delEhsItem,
  exportEhsItem,
  uploadEhsFile,
  getEhsItemByPage,
  updateEhsItem,
  addEhsStandard,
  delEhsStandard,
  exportEhsStandard,
  getEhsStandardByPage,
  updateEhsStandard,
  getTemplateIDs,
  receiveEhsItem,
  addEhsFile,
  delEhsFile,
  exportEhsFile,
  getEhsFileByPage,
  updateEhsFile,
} from '@/services/device/EHSInfo';
import { tableSearchPublicConfig } from '@/utils/filterUtils';
import { PlusOutlined, UploadOutlined, LogoutOutlined, DownOutlined } from '@ant-design/icons';
import { PageHeaderWrapper } from '@ant-design/pro-layout';
import type { ActionType, ProColumns } from '@ant-design/pro-table';
import type { tabType } from '@/pages/product/components/interfaceProduct';
import ProTable from '@ant-design/pro-table';
import {
  Button,
  Form,
  Input,
  message,
  Modal,
  Tree,
  Upload,
  Row,
  Col,
  Dropdown,
  Space,
  Select,
  Tabs,
  InputNumber,
  Tooltip,
  DatePicker,
} from 'antd';
import type { MenuProps } from 'antd';
import { sortTran, filterTran } from '@/utils/requestUtil';
import React, { useEffect, useRef, useState } from 'react';
import { history } from 'umi';
import moment from 'moment';
import {
  ModalForm,
  ProFormDatePicker,
  ProFormItem,
  ProFormSelect,
  ProFormText,
  ProFormTextArea,
} from '@ant-design/pro-components';
import { getFileInfoByPage } from '@/services/project/fileInfo';
import { Ellipsis } from '@/components/Ellipsis';
import { text } from 'express';
const EHSInfomation: React.FC<{}> = () => {
  const actionRef = useRef<ActionType>();
  const actionRef_2 = useRef<ActionType>();
  const actionRef_3 = useRef<ActionType>();
  const actionRef_file = useRef<ActionType>();
  const [modalVisit, setModalVisit] = useState(false); // 新建和编辑提示框
  const [modalVisit2, setModalVisit2] = useState(false); // 新建和编辑提示框
  const [modalVisit3, setModalVisit3] = useState(false); // 新建和编辑提示框
  const [modalVisit4, setModalVisit4] = useState(false); // 上传附件
  const [modalVisit_g, setModalVisit_g] = useState(false); // 上传附件
  const [modalVisit_file, setModalVisit_file] = useState(false); // 上传附件

  const [fileList, setFileList] = useState();
  const [confirmLoading, setConfirmLoading] = useState(false);
  const [confirmLoading2, setConfirmLoading2] = useState(false);
  const [confirmLoading3, setConfirmLoading3] = useState(false);
  const [confirmLoading4, setConfirmLoading4] = useState(false);
  const [confirmLoading_g, setConfirmLoading_g] = useState(false);
  const [confirmLoading_file, setConfirmLoading_file] = useState(false);

  const [formTitle, setFormTitle] = useState(''); //
  const [formTitle2, setFormTitle2] = useState(''); //
  const [formTitle3, setFormTitle3] = useState(''); //
  const [formTitle4, setFormTitle4] = useState('新建'); //
  const [formTitle_g, setFormTitle_g] = useState(''); //
  const [formTitle_file, setFormTitle_file] = useState(''); //

  const [createOrUpdate, setCreateOrUpdate] = useState(false); //编辑框的disable
  const [theselectedRowKeys, settheSelectedRowKeys] = useState<React.Key[]>([]);
  const [createOrUpdate2, setCreateOrUpdate2] = useState(false);
  const [file, setFile] = useState();
  const [templateOption, setTemplateOption] = useState([]);
  const [checkInfo, setCheckInfo] = useState();
  const [commissionOption, setCommissionOption] = useState([]);
  const [handlerOption, setHandleOption] = useState([]);
  const [itemId, setItemId] = useState('');

  const [form] = Form.useForm();
  const [formData, setFormData] = useState({});
  const ref = useRef(null);

  const fileInfo = {
    ehsitemId: '',
    // multipartFile: '',
    fileName: '',
    memo: '11',
  };

  //选中selection中的序号
  const onSelectChange = (newSelectedRowKeys: React.Key[]) => {
    settheSelectedRowKeys(newSelectedRowKeys);
    // console.log(newSelectedRowKeys);
  };

  // EHS Info
  const EHSInfo: ProColumns[] = [
    {
      title: '序号',
      align: 'center',
      sorter: true,
      dataIndex: 'index',
      valueType: 'index',
      width: 60,
    },
    /* {
      title: '唯一标识',
      dataIndex: 'identification',
      hideInTable: true,
    }, */
    {
      title: '检查单号',
      align: 'center',
      sorter: true,

      dataIndex: 'checkId',
      width: 120,
    },
    {
      title: '检查日期',
      dataIndex: 'checkDate',
      align: 'center',
      sorter: true,

      search: false,
      valueType: 'date',
      width: 80,
    },
    {
      title: '问题状态',
      dataIndex: 'state',
      align: 'center',
      sorter: true,

      width: 80,
    },
    {
      title: 'EHS专员',
      dataIndex: 'checkBy',
      search: false,
      align: 'center',
      sorter: true,

      width: 120,
    },

    {
      title: '整体结果',
      dataIndex: 'result',
      align: 'center',
      sorter: true,

      search: false,
      width: 180,
    },
    {
      title: '处理时间',
      dataIndex: 'handleTime',
      align: 'center',
      sorter: true,

      /* render: (record) => <p>{moment(record.handleTime).format('YYYY-MM-DD HH:mm')}</p>, */
      search: false,
      width: 150,
      render: (text, record) => <a>{moment(record.handleTime).format('YYYY-MM-DD HH:mm')}</a>,
    },
    {
      title: '处理人员',
      dataIndex: 'handleBy',
      align: 'center',
      sorter: true,

      search: false,
      width: 120,
    },
    {
      title: '操作',
      valueType: 'option',
      key: 'option',
      align: 'center',

      fixed: 'right',
      width: 150,
      render: (text, record, _, action) => [
        <a
          key="generateKey"
          onClick={() => {
            setModalVisit_g(true);
            setFormTitle_g('编辑');
            setCheckInfo(record.checkId);
            console.log('大表checkid是', checkInfo);
          }}
        >
          生成子项
        </a>,
        <a
          key="editKey"
          onClick={() => {
            setModalVisit(true);
            setCreateOrUpdate(false);
            setFormTitle('编辑');
            form.setFieldsValue({
              identification: record.identification,
              checkDate: moment(record.checkDate),
              checkBy: record.checkBy,
              checkId: record.checkId,
              result: record.result,
              handleTime: moment(record.handleTime),
              handleBy: record.handleBy,
              state: record.state,
              createTime: moment(record.createTime),
              /* createBy: record.createBy,
              updateTime: moment(record.updateTime),
              updateBy: record.updateBy, */
              id: record.id,
            });
          }}
        >
          编辑
        </a>,
        <a
          key="deleteKey"
          onClick={() => {
            Modal.confirm({
              title: '删除',
              content: '确定要删除吗',
              okText: '确认',
              cancelText: '取消',
              onOk: async () => {
                await delEhsInfo({ id: record.id });
                actionRef.current!.reload();
              },
            });
          }}
        >
          删除
        </a>,
      ],
    },
  ];

  // EHS Item
  const EHSItem: ProColumns[] = [
    {
      title: '序号',
      align: 'center',
      sorter: true,

      dataIndex: 'index',
      valueType: 'index',
      width: 80,
    },
    /* {
      title: '唯一标识',
      dataIndex: 'identification',
      hideInTable: true,
    }, */
    {
      title: '检查单号',
      align: 'center',
      sorter: true,

      dataIndex: 'checkId',
    },
    {
      title: '检查项目',
      align: 'center',
      sorter: true,

      dataIndex: 'itemName',
    },
    {
      title: '检查描述',
      align: 'center',
      sorter: true,

      dataIndex: 'itemDesc',
      search: false,
      onCell: () => {
        return {
          style: {
            maxWidth: 100,
            overflow: 'hidden',
            whiteSpace: 'nowrap',
            textOverflow: 'ellipsis',
            cursor: 'pointer',
          },
        };
      },
      render: (text) => (
        <Tooltip placement="topLeft" title={text}>
          {text}
        </Tooltip>
      ),
    },
    {
      title: '检查结果',
      align: 'center',
      sorter: true,

      dataIndex: 'itemResult',
      onCell: () => {
        return {
          style: {
            maxWidth: 100,
            overflow: 'hidden',
            whiteSpace: 'nowrap',
            textOverflow: 'ellipsis',
            cursor: 'pointer',
          },
        };
      },
      render: (text) => (
        <Tooltip placement="topLeft" title={text}>
          {text}
        </Tooltip>
      ),
    },
    {
      title: '问题描述',
      search: false,
      align: 'center',
      sorter: true,

      onCell: () => {
        return {
          style: {
            maxWidth: 100,
            overflow: 'hidden',
            whiteSpace: 'nowrap',
            textOverflow: 'ellipsis',
            cursor: 'pointer',
          },
        };
      },
      render: (text) => (
        <Tooltip placement="topLeft" title={text}>
          {text}
        </Tooltip>
      ),
      dataIndex: 'issue',
    },
    {
      title: '解决办法',
      search: false,
      align: 'center',
      sorter: true,

      dataIndex: 'measure',
      onCell: () => {
        return {
          style: {
            maxWidth: 100,
            overflow: 'hidden',
            whiteSpace: 'nowrap',
            textOverflow: 'ellipsis',
            cursor: 'pointer',
          },
        };
      },
      render: (text) => (
        <Tooltip placement="topLeft" title={text}>
          {text}
        </Tooltip>
      ),
    },
    /*     {
      title: '附件',
     align: 'center',sorter: true, 
      search: false,
      dataIndex: 'attachment',
    }, */
    {
      title: '检查状态',
      search: false,
      align: 'center',
      sorter: true,

      dataIndex: 'itemState',
    },
    {
      title: '备注',
      align: 'center',
      sorter: true,

      search: false,
      dataIndex: 'notes',
    },

    {
      title: '模板编号',
      align: 'center',
      sorter: true,

      dataIndex: 'templateId',
    },
    {
      title: '是否需要附件',
      search: false,
      align: 'center',
      sorter: true,

      dataIndex: 'isAttached',
    },
    {
      title: '操作',
      valueType: 'option',
      key: 'option',
      align: 'center',

      width: 300,
      fixed: 'right',
      // width: 238,
      render: (text, record, _, action) => [
        <a
          key="editKey"
          onClick={() => {
            setModalVisit2(true);
            setCreateOrUpdate(false);
            setFormTitle2('编辑');
            form.setFieldsValue({
              // identification: record.identification,
              templateId: record.templateId,
              itemName: record.itemName,
              isAttached: record.isAttached,
              itemDesc: record.itemDesc,
              itemResult: record.itemResult,
              issue: record.issue,
              measure: record.measure,
              attachment: record.attachment,
              itemState: record.itemState,
              notes: record.notes,
              checkId: record.checkId,
              id: record.id,
            });
          }}
        >
          编辑
        </a>,
        <a
          key="deleteKey"
          onClick={() => {
            Modal.confirm({
              title: '删除',
              content: '确定要删除吗',
              okText: '确认',
              cancelText: '取消',
              onOk: async () => {
                await delEhsItem({ id: record.id });
                actionRef_2.current!.reload();
              },
            });
          }}
        >
          删除
        </a>,
        <a
          key="uploadFile"
          onClick={() => {
            setItemId(record.id);
            setFormTitle_file('新建');
            setModalVisit_file(true);
          }}
        >
          查看附件
        </a>,
      ],
    },
  ];

  // EHS Standard
  const EHSStandard: ProColumns[] = [
    {
      title: '序号',
      dataIndex: 'index',
      align: 'center',
      sorter: true,

      valueType: 'index',
      width: 80,
    },
    /* {
      title: '唯一标识',
      dataIndex: 'identification',
      hideInTable: true,
    }, */
    {
      title: '模板编号',
      align: 'center',
      sorter: true,

      dataIndex: 'templateId',
    },
    {
      title: '检查项目',
      align: 'center',
      sorter: true,

      dataIndex: 'checkItem',
    },
    {
      title: '检查描述',
      search: false,
      align: 'center',
      sorter: true,

      dataIndex: 'checkDesc',
      onCell: () => {
        return {
          style: {
            maxWidth: 100,
            overflow: 'hidden',
            whiteSpace: 'nowrap',
            textOverflow: 'ellipsis',
            cursor: 'pointer',
          },
        };
      },
      render: (text) => (
        <Tooltip placement="topLeft" title={text}>
          {text}
        </Tooltip>
      ),
    },
    {
      title: '是否有效',
      align: 'center',
      sorter: true,

      dataIndex: 'isValid',
    },
    {
      title: '顺序编号',
      align: 'center',
      sorter: true,

      search: false,
      dataIndex: 'sequence',
    },
    {
      title: '是否需要附件',
      search: false,
      align: 'center',
      sorter: true,

      dataIndex: 'isAttached',
    },
    {
      title: '备注',
      search: false,
      align: 'center',
      sorter: true,

      dataIndex: 'notes',
      onCell: () => {
        return {
          style: {
            maxWidth: 100,
            overflow: 'hidden',
            whiteSpace: 'nowrap',
            textOverflow: 'ellipsis',
            cursor: 'pointer',
          },
        };
      },
      render: (text) => (
        <Tooltip placement="topLeft" title={text}>
          {text}
        </Tooltip>
      ),
    },
    {
      title: '操作',
      align: 'center',

      valueType: 'option',
      key: 'option',
      fixed: 'right',
      // width: 238,
      render: (text, record, _, action) => [
        <a
          key="editKey"
          onClick={() => {
            setModalVisit3(true);
            setCreateOrUpdate(false);
            setFormTitle3('编辑');
            form.setFieldsValue({
              identification: record.identification,
              checkItem: record.checkItem,
              checkDesc: record.checkDesc,
              isValid: record.isValid,
              templateId: record.templateId,
              sequence: record.sequence,
              isAttached: record.isAttached,
              notes: record.notes,
              id: record.id,
            });
          }}
        >
          编辑
        </a>,
        <a
          key="deleteKey"
          onClick={() => {
            Modal.confirm({
              title: '删除',
              content: '确定要删除吗',
              okText: '确认',
              cancelText: '取消',
              onOk: async () => {
                await delEhsStandard({ id: record.id });
                actionRef_3.current!.reload();
              },
            });
          }}
        >
          删除
        </a>,
      ],
    },
  ];

  const formatterTime = (val) => {
    return val ? moment(val).format('YYYY-MM-DD HH:mm:ss') : '';
  };
  //附件查看
  const fileCol: ProColumns[] = [
    {
      title: '序号',
      align: 'center',
      sorter: true,

      dataIndex: 'index',
      valueType: 'index',
      width: 60,
    },
    /* {
      title: '唯一标识',
      dataIndex: 'identification',
      hideInTable: true,
    }, */
    {
      title: '文件名',
      align: 'center',
      sorter: true,

      dataIndex: 'fileName',
      width: 150,
    },
    {
      title: '备注',
      align: 'center',
      sorter: true,

      dataIndex: 'memo',
      search: false,
      width: 200,
      onCell: () => {
        return {
          style: {
            maxWidth: 100,
            overflow: 'hidden',
            whiteSpace: 'nowrap',
            textOverflow: 'ellipsis',
            cursor: 'pointer',
          },
        };
      },
      render: (text) => (
        <Tooltip placement="topLeft" title={text}>
          {text}
        </Tooltip>
      ),
    },
    {
      title: '创建日期', //表头显示的名称
      search: false,
      dataIndex: 'createTime',
      width: 90,

      align: 'center',
      sorter: true,

      render: (text) => <>{Ellipsis(text)}</>,
    },
    {
      title: '创建人', //表头显示的名称
      search: false,
      dataIndex: 'createName',
      width: 90,
      align: 'center',
      sorter: true,

      render: (text) => <>{Ellipsis(text)}</>,
    },
    {
      title: '操作',
      valueType: 'option',
      key: 'option',
      align: 'center',

      width: 120,
      fixed: 'right',
      // width: 238,
      render: (text, record, _, action) => [
        <a
          key="previewKey"
          onClick={() => {
            window.open(record.fileUrl);
            actionRef_file.current!.reload();
          }}
        >
          预览下载
        </a>,
        <a
          key="deleteKey"
          onClick={() => {
            Modal.confirm({
              title: '删除',
              content: '确定要删除吗',
              okText: '确认',
              cancelText: '取消',
              onOk: async () => {
                await delEhsFile({ id: record.id });
                actionRef_file.current!.reload();
              },
            });
          }}
        >
          删除附件
        </a>,
      ],
    },
  ];

  //定义Tabs的子结构的数组
  const tabList: tabType[] = [
    {
      name: 'tab1',
      label: 'EHS巡检信息',
      content: (
        <div>
          <ProTable
            headerTitle="巡检信息查询"
            actionRef={actionRef} //用于触发刷新操作等，看api
            rowKey="id" //表格行 key 的取值，可以是字符串或一个函数
            formRef={ref}
            search={tableSearchPublicConfig}
            toolBarRender={(action, { selectedRows }) => [
              <Button
                key="button"
                icon={<PlusOutlined />}
                onClick={() => {
                  setCreateOrUpdate(false);
                  setFormTitle('新建');
                  form.resetFields();
                  setModalVisit(true);
                }}
                type="primary"
              >
                新建
              </Button>,
              <Button
                key="button"
                icon={<PlusOutlined />}
                onClick={() => {
                  const filters = filterTran(ref.current.getFieldsValue());
                  exportEhsInfo({
                    current: 1,
                    pageSize: 5000,
                    filters: filters,
                  }).then((res) => {
                    const aLink = document.createElement('a');
                    document.body.appendChild(aLink);
                    aLink.style.display = 'none';
                    aLink.href = window.URL.createObjectURL(res);
                    aLink.setAttribute('download', `EHSInfo.xls`);
                    aLink.click();
                    document.body.removeChild(aLink);
                  });
                }}
                type="primary"
              >
                导出
              </Button>,
            ]}
            request={async (params = {}, sort, filter) => {
              const res = { ...params };
              const sorters = sortTran(sort);
              const filters = filterTran(res);
              const result = await getEhsInfoByPage({
                ...params,
                sorters: sorters,
                filters: filters,
              });
              //getproductbop();
              //过滤后端传递的null数据

              const tableinfo1: any[] = [];
              result.data.content.map((item: any, index: number) => {
                if (item != null) {
                  tableinfo1.push(item);
                }
              });
              console.log('获得的页面数据', result);
              console.log('大表单的页面数据', tableinfo1);

              const resultTemplate = await getTemplateIDs(null);
              const tempInfo: any[] = [];
              resultTemplate.data.map((item: any) => {
                if (item.isValid == '是') {
                  tempInfo.push({ id: item.templateId, value: item.templateId });
                }
              });
              setTemplateOption(tempInfo);

              const reco = await getEhsCommissioners(null);
              console.log('获取的ehs专员', reco);
              const reInfo: any[] = [];
              reco.data.map((item: any) => {
                if (item != null) {
                  reInfo.push({ id: item, value: item });
                }
              });

              setCommissionOption(reInfo);

              const resultHandle = await getEhsHandlers(null);
              console.log('zhuanyerneyuan ', resultHandle);
              const handleInfo: any[] = [];
              resultHandle.data.map((item: any) => {
                if (item != null) {
                  handleInfo.push({ id: item, value: item });
                }
              });

              setHandleOption(handleInfo);

              return {
                data: tableinfo1,
                total: result.data.totalElements,
                success: result.success,
              };
            }}
            columns={EHSInfo}
            scroll={{ x: 1200, y: 450 }} //表项不够 只能缩短表格的长度
            rowSelection={{ onChange: onSelectChange }}
          />
        </div>
      ),
    },
    /* {
      name: 'tab2',
      label: 'EHS巡检单',
      content: (
        <div>
          <ProTable
            headerTitle="巡检单"
            actionRef={actionRef_2} //用于触发刷新操作等，看api
            rowKey="id" //表格行 key 的取值，可以是字符串或一个函数
            formRef={ref}
            search={{
              labelWidth: 100,
              defaultCollapsed: true,
            }}
            toolBarRender={(action, { selectedRows }) => [
              <Button
                key="button"
                icon={<PlusOutlined />}
                onClick={() => {
                  setCreateOrUpdate2(false);
                  setFormTitle2('新建');
                  form.resetFields();
                  setModalVisit2(true);
                }}
                type="primary"
              >
                新建
              </Button>,
              <Button
                key="button"
                icon={<PlusOutlined />}
                onClick={() => {
                  const filters = filterTran(ref.current.getFieldsValue());
                  exportEhsItem({
                    current: 1,
                    pageSize: 5000,
                    filters: filters,
                  }).then((res) => {
                    const aLink = document.createElement('a');
                    document.body.appendChild(aLink);
                    aLink.style.display = 'none';
                    aLink.href = window.URL.createObjectURL(res);
                    aLink.setAttribute('download', `EHSItem.xls`);
                    aLink.click();
                    document.body.removeChild(aLink);
                  });
                }}
                type="primary"
              >
                导出
              </Button>,
            ]}
            request={async (params = {}, sort, filter) => {
              const res = { ...params };
              const sorters = sortTran(sort);
              const filters = filterTran(res);
              const result = await getEhsItemByPage({
                ...params,
                sorters: sorters,
                filters: filters,
              });
              //getproductbop();
              //过滤后端传递的null数据
              const tableinfo2: any[] = [];
              result.data.content.map((item: any, index: number) => {
                if (item != null) {
                  tableinfo2.push(item);
                }
              });
              console.log(result.data.content);
              console.log(tableinfo2);
              return {
                data: tableinfo2,
                total: tableinfo2.length,
                success: result.success,
              };
            }}
            columns={EHSItem}
            scroll={{ x: 2000, y: 450 }}
            rowSelection={{ onChange: onSelectChange }}
          />
        </div>
      ),
    }, */
    // {
    //   name: 'tab3',
    //   label: 'EHS巡检模版',
    //   content: (
    //     <div>
    //       <ProTable
    //         headerTitle="巡检模版"
    //         actionRef={actionRef_3} //用于触发刷新操作等，看api
    //         rowKey="id" //表格行 key 的取值，可以是字符串或一个函数
    //         formRef={ref}
    //         search={{
    //           labelWidth: 100,
    //           defaultCollapsed: true,
    //         }}
    //         toolBarRender={(action, { selectedRows }) => [
    //           <Button
    //             key="button"
    //             icon={<PlusOutlined />}
    //             onClick={() => {
    //               setCreateOrUpdate(false);
    //               setFormTitle3('新建');
    //               form.resetFields();
    //               setModalVisit3(true);
    //             }}
    //             type="primary"
    //           >
    //             新建
    //           </Button>,
    //           <Button
    //             key="button"
    //             icon={<PlusOutlined />}
    //             onClick={() => {
    //               const filters = filterTran(ref.current.getFieldsValue());
    //               exportEhsStandard({
    //                 current: 1,
    //                 pageSize: 5000,
    //                 filters: filters,
    //               }).then((res) => {
    //                 const aLink = document.createElement('a');
    //                 document.body.appendChild(aLink);
    //                 aLink.style.display = 'none';
    //                 aLink.href = window.URL.createObjectURL(res);
    //                 aLink.setAttribute('download', `EHSStandard.xls`);
    //                 aLink.click();
    //                 document.body.removeChild(aLink);
    //               });
    //             }}
    //             type="primary"
    //           >
    //             导出
    //           </Button>,
    //         ]}
    //         request={async (params = {}, sort, filter) => {
    //           const res = { ...params };
    //           const sorters = sortTran(sort);
    //           const filters = filterTran(res);
    //           const result = await getEhsStandardByPage({
    //             ...params,
    //             sorters: sorters,
    //             filters: filters,
    //           });
    //           //getproductbop();
    //           //过滤后端传递的null数据
    //           const tableinfo3: any[] = [];
    //           result.data.content.map((item: any, index: number) => {
    //             if (item != null) {
    //               tableinfo3.push(item);
    //             }
    //           });
    //           console.log(result.data.content);
    //           console.log(tableinfo3);
    //           return {
    //             data: tableinfo3,
    //             total: tableinfo3.length,
    //             success: result.success,
    //           };
    //         }}
    //         columns={EHSStandard}
    //         scroll={{ x: 2000, y: 450 }}
    //         rowSelection={{ onChange: onSelectChange }}
    //       />
    //     </div>
    //   ),
    // },
  ];

  const handleClose = async () => {
    setModalVisit_file(false);
  };

  //提交ehsinfo
  const handleSubmit = async (values) => {
    setConfirmLoading(true);
    console.log('页面结果0927', values, '标题1 ', formTitle);
    if (formTitle == '新建') {
      console.log('title', formTitle);
      const result = await addEhsInfo(values);
      if (result != null) {
        message.success('添加成功');
        console.log('我曹', result);
      }
    } else if (formTitle == '编辑') {
      const result = await updateEhsInfo(values);
      if (result != null) {
        message.success('修改成功');
      }
    }
    setConfirmLoading(false);
    setModalVisit(false);
    actionRef.current.reload();
  };

  //提交ehsitem-子项新建
  const handleSubmit2 = async (values) => {
    console.log('能不能传', form.getFieldsValue());
    setConfirmLoading2(true);

    if (formTitle2 == '新建') {
      const result = await addEhsItem(values);
      console.log('生成子项新建结果', result);
      if (result != null) {
        message.success('添加成功');
      }
    } else if (formTitle2 == '编辑') {
      const result = await updateEhsItem(values);
      if (result != null) {
        message.success('修改成功');
      }
    }
    setConfirmLoading2(false);
    setModalVisit2(false);
    actionRef_2.current.reload();
  };

  //提交ehsstandard-模版
  const handleSubmit3 = async (values) => {
    setConfirmLoading3(true);
    console.log('standard标题', values);
    if (formTitle3 == '新建') {
      const result = await addEhsStandard(values);
      if (result != null) {
        message.success('添加成功');
      }
    } else if (formTitle3 == '编辑') {
      const result = await updateEhsStandard(values);
      if (result != null) {
        message.success('修改成功');
      }
    }
    setConfirmLoading3(false);
    setModalVisit3(false);
    actionRef_3.current.reload();
  };
  //提交生成表
  const handleSubmit_g = async (values) => {
    setConfirmLoading_g(true);
    console.log('standard标题', formTitle_g);
    if (formTitle3 == '新建') {
      const result = await addEhsStandard(values);
      if (result != null) {
        message.success('添加成功');
      }
    } else if (formTitle3 == '编辑') {
      const result = await updateEhsStandard(values);
      if (result != null) {
        message.success('修改成功');
      }
    }
    setConfirmLoading_g(false);
    setModalVisit_g(false);
    actionRef.current.reload();
  };

  const templateImport = async () => {
    const result = form.getFieldsValue();
    const temp = await receiveEhsItem(result.templateId);
    console.log(result, '获取到的模版信息：', temp);
    if (result.templateId == null) {
      message.warning('请选择模版编号！');
    } else {
      const info = temp.data;
      form.setFieldsValue({
        itemName: info.itemName,
        itemDesc: info.itemDesc,
        // itemResult: info.itemResult,
        // issue: info.issue,
        // measure: info.itemName,
        // itemState: info.itemState,
        // checkID: info.checkID,
        isAttached: info.isAttached,
        notes: info.notes,
      });
      console.log('现在呢', form.getFieldsValue());
    }
  };

  const onFilesChange = async (file) => {
    setFile(file);
  };
  const beforeUpload = (file, fileList) => {
    setFile(file);
    if (fileList.length >= 1) {
      return false; // 阻止上传
    }
    return true; // 允许上传
  };

  //上传附件
  const handleFile = async () => {
    setConfirmLoading4(true);
    if (formTitle4 == '新建') {
      form
        .validateFields()
        .then(async (value) => {
          if (file == undefined) message.error('请上传文件！');
          if (file.size / 1024 / 1024 < 100) {
            const info = form.getFieldsValue();
            const res = { ...form.getFieldsValue() };
            const formData = new window.FormData();
            res.file.fileList.map((file: any) => {
              formData.append('file', file);
            });
            // formData1.append('file', info.file.file);
            fileInfo.multipartFile = formData;
            fileInfo.fileName = info.file.file.name;
            fileInfo.ehsitemId = itemId;
            const result = await uploadEhsFile(fileInfo);
            console.log(fileInfo, '成了吗', result);
            if (result != null) {
              message.success('添加成功');
            }
            setFile(undefined);
            setConfirmLoading4(false);
            setModalVisit4(false);
            actionRef_file.current!.reload();
          } else {
            setConfirmLoading4(false);
            message.info('文件大小不能超过100MB!');
          }
          //form.resetFields();
        })
        .catch((err) => {
          setConfirmLoading4(false);
        });
    } /* else {
      form
        .validateFields()
        .then(async () => {
          const res = form.getFieldsValue();
          res.file = new FormData();
          res.infoId = optionsProName.find(
            () => optionsProName.label === form.getFieldsValue.projectName,
          ).value;
          if (file != null) {
            const formData = new window.FormData();
            formData.append('file', file);
            res.file = formData;
          }
          const result = await updateFileInfo(res);
          if (result != null) {
            message.success('修改成功！');
          }
          setConfirmLoading(false);
          setModalVisit(false);
          actionRef.current!.reload();
        })
        .catch(() => {
          setConfirmLoading4(false);
        });
    } */
  };

  return (
    <PageHeaderWrapper title={false} breadcrumb={undefined}>
      <Tabs
        type="card"
        defaultActiveKey="1"
        items={tabList.map((item, i) => {
          const id = String(i + 1);
          return {
            label: item.label,
            key: id,
            children: <div>{item.content}</div>,
          };
        })}
      />
      {/* info-巡检单大表弹窗 */}
      <ModalForm
        layout="horizontal"
        labelCol={{ span: 8 }}
        wrapperCol={{ span: 16 }}
        form={form}
        title={formTitle}
        visible={modalVisit}
        onFinish={handleSubmit}
        confirmLoading={confirmLoading}
        modalProps={{
          destroyOnClose: true,
          onCancel: () => {
            setModalVisit(false);
          },
        }}
      >
        <ProFormText name="id" label="id" placeholder="请输入名称" hidden={true} />
        <ProFormText
          name="identification"
          label="唯一标识"
          rules={[{ required: true, message: '请输入唯一标识!' }]}
          disabled={createOrUpdate}
          initialValue={1111}
          hidden={true}
        />
        {/*  <Row gutter={[50, 0]}>
          <col span={12}>
            <ProFormText
              name="checkId"
              label="检查单号"
              rules={[{ required: true, message: '请输入 your inspectDesc!' }]}
              disabled={createOrUpdate}
            />
          </col>
          <col span={12}>
            <ProFormDatePicker
              name="checkDate"
              label="检查日期"
              rules={[{ required: true, message: '请输入!' }]}
              disabled={createOrUpdate}
            />
          </col>
        </Row> */}
        <ProFormText
          name="checkId"
          label="检查单号"
          disabled={createOrUpdate}
          hidden={true}
          initialValue={11213}
        />
        <Row gutter={[50, 0]}>
          <Col span={12}>
            <ProFormSelect
              name="checkBy"
              label="EHS专员"
              options={commissionOption}
              rules={[{ required: true, message: '请选择EHS专员!' }]}
              disabled={createOrUpdate}
            />
          </Col>
          <Col span={12}>
            <ProFormDatePicker
              name="checkDate"
              label="检查日期"
              rules={[{ required: true, message: '请选择检查日期!' }]}
              width={'100%'}
              disabled={createOrUpdate}
            />
          </Col>
        </Row>
        <Row gutter={[50, 0]}>
          <Col span={12}>
            <ProFormSelect
              name="state"
              label="问题状态"
              rules={[{ required: true, message: '请选择问题状态 !' }]}
              valueEnum={{
                未完成: '未完成',
                进行中: '进行中',
                已完成: '已完成',
              }}
              disabled={createOrUpdate}
            />
          </Col>
          <Col span={12}>
            <ProFormSelect
              name="handleBy"
              label="处理人员"
              options={handlerOption}
              rules={[{ required: true, message: '请选择处理人员!' }]}
              disabled={createOrUpdate}
            />
          </Col>
        </Row>
        <Row gutter={[50, 0]}>
          <Col span={12}>
            <Form.Item
              name="handleTime"
              label="处理时间"
              rules={[{ required: true, message: '请选择处理时间!' }]}
            >
              <DatePicker
                style={{ width: '100%' }}
                showTime={{
                  format: 'HH:mm',
                }}
                format="YYYY-MM-DD HH:mm"
                disabled={createOrUpdate}
              />
            </Form.Item>
            {/* <ProFormDatePicker
              name="handleTime"
              label="处理时间"
              disabled={createOrUpdate}
              width={350}
            /> */}
          </Col>
          <Col span={12}>
            <ProFormText
              name="result"
              label="整体结果"
              /*  rules={[{ required: true, message: '请输入 your times!' }]} */
              disabled={createOrUpdate}
            />
          </Col>
        </Row>
      </ModalForm>
      {/* item-生成子项新建弹窗 */}
      <ModalForm
        layout="horizontal"
        labelCol={{ span: 8 }}
        wrapperCol={{ span: 16 }}
        form={form}
        title={formTitle2}
        visible={modalVisit2}
        onFinish={handleSubmit2}
        confirmLoading={confirmLoading2}
        modalProps={{
          destroyOnClose: true,
          onCancel: () => {
            setModalVisit2(false);
          },
        }}
      >
        <ProFormText name="id" label="id" placeholder="请输入名称" hidden={true} />
        {/* <ProFormText
          name="identification"
          label="唯一标识"
          rules={[{ required: true, message: '请输入 your category!' }]}
          disabled={createOrUpdate}
          initialValue={1121}
          hidden={true}
        /> */}
        <Row gutter={[50, 0]}>
          <Col span={12}>
            <ProFormText
              name="itemName"
              label="检查项目"
              disabled={createOrUpdate}
              rules={[{ required: true, message: '请输入检查项目!' }]}
            />
          </Col>
          <Col span={12}>
            <ProFormText
              name="checkId"
              label="检查单号"
              initialValue={checkInfo}
              disabled={true}
              rules={[{ required: true, message: '请输入检查单号!' }]}
            />
          </Col>
        </Row>
        <Row gutter={[50, 0]}>
          <Col span={12}>
            <ProFormText
              name="itemResult"
              label="检查结果"
              disabled={createOrUpdate}
              rules={[{ required: true, message: '请输入检查结果!' }]}
            />
          </Col>
          <Col span={12}>
            <ProFormText
              name="measure"
              label="解决办法"
              disabled={createOrUpdate}
              rules={[{ required: true, message: '请输入解决办法!' }]}
            />
          </Col>
        </Row>
        <Row gutter={[50, 0]}>
          <Col span={12}>
            <ProFormText name="itemDesc" label="检查描述" disabled={createOrUpdate} />
          </Col>
          <Col span={12}>
            <ProFormText name="itemState" label="检查状态" disabled={createOrUpdate} />
          </Col>
        </Row>
        <Row gutter={[50, 0]}>
          <Col span={12}>
            <ProFormText name="issue" label="问题描述" disabled={createOrUpdate} />
          </Col>

          <Col span={12}>
            <ProFormSelect
              name="isAttached"
              label="是否需要附件"
              valueEnum={{
                是: '是',
                否: '否',
              }}
            />
          </Col>
        </Row>
        <Row gutter={[50, 0]}>
          <Col span={12}>
            <ProFormSelect
              name="templateId"
              label="模板编号"
              disabled={createOrUpdate}
              options={templateOption}
              tooltip="可选择模版导入对应模版信息"
              // rules={[{ required: true, message: '请输入!' }]}
            />
          </Col>
          <Col span={12}>
            <ProFormItem>
              <Button type="primary" onClick={templateImport}>
                导入模版
              </Button>
            </ProFormItem>
          </Col>
        </Row>

        <Row gutter={[50, 0]}>
          <Col span={24}>
            <ProFormTextArea
              labelCol={{ span: 4 }}
              wrapperCol={{ span: 20 }}
              name="notes"
              label="备注"
              // rules={[{ required: true, message: '请输入 notes!' }]}
              placeholder="请输入备注"
              fieldProps={{ width: '100%', showCount: true, maxLength: 100, rows: 3 }}
              // disabled={createOrUpdate}
            />
          </Col>
        </Row>

        {/* <ProFormText name="measure" label="附件" disabled={true} /> */}
      </ModalForm>
      {/* standard-巡检模版页面 */}
      <ModalForm
        layout="horizontal"
        labelCol={{ span: 8 }}
        wrapperCol={{ span: 16 }}
        form={form}
        title={formTitle3}
        visible={modalVisit3}
        onFinish={handleSubmit3}
        confirmLoading={confirmLoading3}
        modalProps={{
          destroyOnClose: true,
          onCancel: () => {
            setModalVisit3(false);
          },
        }}
      >
        <ProFormText name="id" label="id" placeholder="请输入名称" hidden={true} />
        <ProFormText
          name="identification"
          label="唯一标识"
          rules={[{ required: true, message: '请输入唯一标识!' }]}
          disabled={createOrUpdate}
          initialValue={111}
          hidden={true}
        />
        <Row gutter={[50, 0]}>
          <Col span={12}>
            <ProFormText
              name="templateId"
              label="模板编号"
              disabled={createOrUpdate}
              rules={[{ required: true, message: '请输入模板编号!' }]}
            />
          </Col>
          <Col span={12}>
            <ProFormText
              name="checkDesc"
              label="检查描述"
              disabled={createOrUpdate}
              rules={[{ required: true, message: '请输入检查描述!' }]}
            />
          </Col>
        </Row>
        <Row gutter={[50, 0]}>
          <Col span={12}>
            <ProFormText
              name="checkItem"
              label="检查项目"
              disabled={createOrUpdate}
              rules={[{ required: true, message: '请输入检查项目!' }]}
            />
          </Col>
          <Col span={12}>
            {/* <ProFormText
              name="sequence"
              label="顺序编号"
              disabled={createOrUpdate}
              rules={[{ required: true, message: '请输入!' }]}
            /> */}
            <Form.Item
              label="顺序编号"
              name="sequence"
              style={{ width: 350 }}
              rules={[{ required: true, message: '请输入顺序编号!' }]}
            >
              <InputNumber
                // addonAfter="件"
                style={{ width: 350 }}
                min={0}
                max={99999}
                step={1}
                // onChange={(e) => handlestandManufactWorkHourChange(e.target.value)}
              />
            </Form.Item>
          </Col>
        </Row>
        <Row gutter={[50, 0]}>
          <Col span={12}>
            <ProFormText
              name="isValid"
              label="是否有效"
              disabled={createOrUpdate}
              valueEnum={{
                是: '是',
                否: '否',
              }}
              rules={[{ required: true, message: '请选择是否有效!' }]}
            />
          </Col>
          <Col span={12}>
            <ProFormSelect
              name="isAttached"
              label="是否需要附件"
              disabled={createOrUpdate}
              rules={[{ required: true, message: '请选择是否需要附件!' }]}
              valueEnum={{
                是: '是',
                否: '否',
              }}
            />
          </Col>
          <Col span={12}>
            {/* <ProFormText name="notes" label="备注" disabled={createOrUpdate} /> */}
          </Col>
        </Row>
        <ProFormTextArea
          labelCol={{ span: 4 }}
          wrapperCol={{ span: 20 }}
          name="notes"
          label="备注"
          // rules={[{ required: true, message: '请输入 notes!' }]}
          placeholder="请输入备注"
          fieldProps={{ width: '100%', showCount: true, maxLength: 100, rows: 3 }}
          // disabled={createOrUpdate}
        />
      </ModalForm>
      {/* 附件弹窗 */}
      <Modal
        title={formTitle4}
        visible={modalVisit4}
        onOk={handleFile}
        confirmLoading={confirmLoading4}
        onCancel={() => setModalVisit4(false)}
        destroyOnClose
      >
        <Form
          name="wrap"
          labelCol={{ flex: '110px' }}
          labelAlign="left"
          labelWrap
          form={form}
          wrapperCol={{ flex: 1 }}
          colon={false}
        >
          <Form.Item
            label="附件"
            name="file"
            rules={[{ required: true, message: '请选择待上传文件！' }]}
          >
            <Upload
              //listType="picture-card"
              file-list="fileList"
              customRequest={onFilesChange} //通过覆盖默认的上传行为，可以自定义自己的上传实现
              showUploadList={true}
              beforeUpload={beforeUpload}
              multiple
            >
              <Button icon={<UploadOutlined />}>上传文件</Button>
            </Upload>
          </Form.Item>
          <Form.Item label="备注" name="memo" rules={[{ required: true, message: '请输入备注!' }]}>
            <Input />
          </Form.Item>
        </Form>
      </Modal>
      {/* 生成子项弹窗 */}
      <ModalForm
        form={form}
        title={formTitle_g}
        visible={modalVisit_g}
        width={1200}
        onFinish={handleSubmit_g}
        confirmLoading={confirmLoading_g}
        modalProps={{
          destroyOnClose: true,
          onCancel: () => {
            setModalVisit_g(false);
          },
        }}
      >
        <ProFormText name="id" label="id" placeholder="请输入名称" hidden={true} />
        {/*  <ProFormText
          name="identification"
          label="唯一标识"
          rules={[{ required: true, message: '请输入 your identification!' }]}
          disabled={createOrUpdate}
          initialValue={111}
          hidden={true}
        /> */}
        <ProTable
          headerTitle="生成子项"
          actionRef={actionRef_2} //用于触发刷新操作等，看api
          rowKey="id" //表格行 key 的取值，可以是字符串或一个函数
          formRef={ref}
          search={false}
          /* search={{
            labelWidth: 100,
            defaultCollapsed: true,
          }} */
          toolBarRender={(action, { selectedRows }) => [
            <Button
              key="button"
              icon={<PlusOutlined />}
              onClick={() => {
                setCreateOrUpdate2(false);
                setFormTitle2('新建');
                form.resetFields();
                setModalVisit2(true);
              }}
              type="primary"
            >
              新建
            </Button>,
            <Button
              key="button"
              icon={<PlusOutlined />}
              onClick={() => {
                const filters = filterTran(ref.current.getFieldsValue());
                exportEhsItem({
                  current: 1,
                  pageSize: 5000,
                  filters: filters,
                }).then((res) => {
                  const aLink = document.createElement('a');
                  document.body.appendChild(aLink);
                  aLink.style.display = 'none';
                  aLink.href = window.URL.createObjectURL(res);
                  aLink.setAttribute('download', `EHSItem.xls`);
                  aLink.click();
                  document.body.removeChild(aLink);
                });
              }}
              type="primary"
            >
              导出
            </Button>,
          ]}
          request={async (params = {}, sort, filter) => {
            const res = { ...params };
            const sorters = sortTran(sort);
            const filters = filterTran(res);
            const result = await getEhsItemByPage({
              ...params,
              sorters: sorters,
              filters: filters,
            });
            //getproductbop();
            //过滤后端传递的null数据
            console.log(checkInfo, '获得的所有子项', result);
            const tableinfo2: any[] = [];
            result.data.content.map((item: any, index: number) => {
              if (item != null && item.checkId == checkInfo) {
                tableinfo2.push(item);
              }
            });
            console.log(result.data.content);
            console.log(tableinfo2);
            return {
              data: tableinfo2,
              total: tableinfo2.length,
              success: result.success,
            };
          }}
          columns={EHSItem}
          scroll={{ x: 2000, y: 450 }}
          rowSelection={{ onChange: onSelectChange }}
        />
      </ModalForm>
      {/* 附件table弹窗 */}
      <ModalForm
        form={form}
        title={formTitle_file}
        visible={modalVisit_file}
        width={1200}
        onFinish={handleClose}
        confirmLoading={confirmLoading_file}
        modalProps={{
          destroyOnClose: true,
          onCancel: () => {
            setModalVisit_file(false);
          },
        }}
      >
        <ProFormText name="id" label="id" placeholder="请输入名称" hidden={true} />
        <ProFormText
          name="identification"
          label="唯一标识"
          rules={[{ required: true, message: '请输入唯一标识!' }]}
          disabled={createOrUpdate}
          initialValue={111}
          hidden={true}
        />
        <ProTable
          headerTitle="附件信息"
          actionRef={actionRef_file} //用于触发刷新操作等，看api
          rowKey="id" //表格行 key 的取值，可以是字符串或一个函数
          formRef={ref}
          search={false}
          /* search={{
            labelWidth: 100,
            defaultCollapsed: true,
          }} */
          toolBarRender={(action, { selectedRows }) => [
            <Button
              key="button"
              icon={<PlusOutlined />}
              onClick={() => {
                setFormTitle4('新建');

                setModalVisit4(true);
              }}
              type="primary"
            >
              新建
            </Button>,
            /*  <Button
              key="button"
              icon={<PlusOutlined />}
              onClick={() => {
                const filters = filterTran(ref.current.getFieldsValue());
                exportEhsItem({
                  current: 1,
                  pageSize: 5000,
                  filters: filters,
                }).then((res) => {
                  const aLink = document.createElement('a');
                  document.body.appendChild(aLink);
                  aLink.style.display = 'none';
                  aLink.href = window.URL.createObjectURL(res);
                  aLink.setAttribute('download', `EHSItem.xls`);
                  aLink.click();
                  document.body.removeChild(aLink);
                });
              }}
              type="primary"
            >
              导出
            </Button>, */
          ]}
          request={async (params = {}, sort, filter) => {
            const res = { ...params };
            const sorters = sortTran(sort);
            const filters = filterTran(res);
            const result = await getEhsFileByPage({
              ...params,
              sorters: sorters,
              filters: filters,
            });
            //getproductbop();
            //过滤后端传递的null数据
            console.log(checkInfo, '获得的文件信息', {
              ...params,
              sorters: sorters,
              filters: filters,
            });
            const tableinfo2: any[] = [];
            result.data.content.map((item: any, index: number) => {
              if (item != null && item.ehsitemId == itemId) {
                tableinfo2.push(item);
              }
            });
            console.log('应该显示的文件信息啊', tableinfo2);
            return {
              data: tableinfo2,
              total: tableinfo2.length,
              success: result.success,
            };
          }}
          columns={fileCol}
          scroll={{ x: 2000, y: 450 }}
          rowSelection={{ onChange: onSelectChange }}
        />
      </ModalForm>
    </PageHeaderWrapper>
  );
};
export default EHSInfomation;
